// pages/newproduct/newdetail/index.js
const app = getApp()
const utils = require('../../../utils/util.js')
Page({

  /**
   * 页面的初始数据
   */
  data: {
    winHeight: '100%',
    detailheights:0,
    toView: 'proDetailBox',//锚点跳转的ID
    actionView: 'proDetailBox',//控制导航显示
    productBoxTop: 0,//新品详情模块距离顶部的距离
    commentBoxTop: 0,//新品方案模块距离顶部的距离
    navHeight: app.globalData.navHeight,
    tabList:[{
        id:1,
        name:'新品详情',
        flag:true
      },
      {
        id:2,
        name:'新品方案',
        flag:false
      }],
    proId:"",
    listShowFlag:0,
    detailLsit:'',
    caseList:[],
    htmlSnip:"",
    videoUrl:"",
    videoPic:"",
    mainPicList:[],
    renderedByHtml: false
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // console.log(options)
    this.setData({
      proId:options.id
    })
    this.handleGetNewProDetail(options.id)
    let that = this;
    wx.getSystemInfo({
      success: function (res) {
        //屏幕的宽度/屏幕的高度 = 微信固定宽度(750)/微信高度
        that.setData({
          winHeight:(res.windowHeight-(res.windowWidth*90/750))*2+'rpx'  
        })
      }
    });
  },
  //锚点定位
  toViewClick(e) {
    // console.log(e)
    this.setData({
      toView: e.target.dataset.hash,  
      actionView: e.target.dataset.hash
    })
  },
  scrollTo(e){
    // console.log(e)
    const  query = wx.createSelectorQuery();
    query.select('#proDetailBox').boundingClientRect(rect=>{
      // console.log(rect)
      this.setData({
        // detailheights:rect.height
        detailheights:Math.abs(rect.top)+114
      })
    }).exec();
    let scrollTop = e.detail.scrollTop;  //滚动的Y轴
    if(this.data.detailheights>0){
      if(scrollTop >= this.data.detailheights+this.data.navHeight){
      this.setData({
        actionView: 'proCaseBox'  
      })
      this.setData({
        tabList:this.data.tabList.map((item)=>{
          if(item.id===2){
            item.flag=true
          }else {
            item.flag=false
          }
          return item
        })
      })


    }else {
      this.setData({
        actionView: 'proDetailBox'  
      })
      this.setData({
        tabList:this.data.tabList.map((item)=>{
          if(item.id===1){
            item.flag=true
          }else {
            item.flag=false
          }
          return item
        })
      })
    }
    }
    
    // this.$apply();//WEPY更新数据
  },
  enterCode(e) {
    this.setData({
      htmlSnip: e.detail.value
    })
  },
  //获取新品下详情内容
  handleGetNewProDetail(id){
    utils.$http(app.globalData.api.getNewProDetailList, {id}, 'GET', true, 'JSON').then(res=>{
      if(res.success===1){
        const strs=res.data.detailExplain
        .replace(/<img/gi, '<img style="width:100%;height:auto;display:block;" ')
        const { mainPicList=[], video, videoPic} = res.data
        if (video) {
          const str = {
            id: 121211212,
            videoPic,
            videoUrl:video
          }
          mainPicList.unshift(str)
        }
        this.setData({
          videoUrl:video,
          videoPic,
          htmlSnip:strs,
          mainPicList,
          caseList:res.data.pcListDTOList
        })
      }
    })
  },
  //点击tab切换详情 方案内容
  handleClickStyles(item){
    // console.log(item)
    const data=item.currentTarget.dataset.list
    this.setData({
      listShowFlag:data,
      toView: item.currentTarget.dataset.hash,  
      actionView: item.currentTarget.dataset.hash
    })
    this.data.tabList.forEach((str,index)=>{
      let modifys='tabList['+index+'].flag'
      if(index===data){
        this.setData({
          [modifys]:true
        })
      }else{
        this.setData({
          [modifys]:false
            })
      }
    })
  },
  scroll(e) {
    // console.log(e)
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
// console.log(this.data.listShowFlag)
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    // 获取各模块距离顶部的距离
    setTimeout(()=>{
          new Promise(resolve => {
      let query = wx.createSelectorQuery();
      query.select('#proDetailBox').boundingClientRect();
      query.select('#proCaseBox').boundingClientRect();
      query.exec(function (res) {
        resolve(res);
      });
    }).then(res => {
      // console.log(res)
      this.setData({
        productBoxTop: res[0].top,
        commentBoxTop: res[1].top,
      });
    });
    },100)

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})